<template>
	<div>
		<creat v-if="showcreat" @close="showcreat = false" :detailId="detailId" :type="type" @success="refreshList(pageNo)"></creat>
		<check v-else-if="showcheck" @close="showcheck = false"></check>
		<show v-else-if="show" @close="show = false" :detailId="detailId"></show>
		<div v-else>
			<basic-container>
				<div class="flex_row" style="align-items: flex-start;">
					<el-button size="small" type="success" @click="creatNew()" v-if="permission.jxsgl_create">新增</el-button>
					<el-form :inline="true" autocomplete size="small" class="ml30" ref="form" :model="form" @keyup.enter.native="refreshList()">
						<el-form-item label="经销商管理编号:">
							<el-input name="xkbh" autocomplete="on" placeholder="请输入" v-model="form.number" class="w160"></el-input>
						</el-form-item>
						<el-form-item label="管理部门:">
							<el-cascader
								class="w160"
								placeholder="请选择"
								ref="newdept"
								:options="deptOption"
								v-model="form.manageDeptId"
								:show-all-levels="false"
								:props="{
									value: 'id',
									label: 'deptName',
									emitPath: false,
									checkStrictly: true
								}"
								filterable
							></el-cascader>
						</el-form-item>
						<el-form-item label="负责人:">
							<el-select class="w160" v-model="form.manageUserId" filterable placeholder="请选择">
								<el-option v-for="item in userList" :key="item.id" :label="item.name" :value="item.id"></el-option>
							</el-select>
						</el-form-item>
						<el-form-item label="批准日期:">
							<el-date-picker class="w140" v-model="form.beginApproveDate" type="date" placeholder="开始日期" value-format="yyyy-MM-dd"></el-date-picker>
							-
							<el-date-picker class="w140" v-model="form.endApproveDate" type="date" value-format="yyyy-MM-dd" placeholder="结束日期"></el-date-picker>
						</el-form-item>
						<block v-if="showmore">
							<el-form-item label="记录保留期限(年):"><el-input placeholder="请输入" v-model="form.retentionPeriod" class="w160"></el-input></el-form-item>
							<el-form-item label="编制部门:">
								<el-cascader
									class="w160"
									placeholder="请选择"
									ref="newdept"
									:options="deptOption"
									v-model="form.createDept"
									:show-all-levels="false"
									:props="{
										value: 'id',
										label: 'deptName',
										emitPath: false,
										checkStrictly: true
									}"
									filterable
								></el-cascader>
							</el-form-item>
							<el-form-item label="编制人:">
								<el-select class="w160" v-model="form.createUser" filterable placeholder="请选择">
									<el-option v-for="item in userList" :key="item.id" :label="item.name" :value="item.id"></el-option>
								</el-select>
							</el-form-item>
							<el-form-item label="提交日期:">
								<el-date-picker class="w140" v-model="form.beginSubmitDate" type="date" placeholder="开始日期" value-format="yyyy-MM-dd"></el-date-picker>
								-
								<el-date-picker class="w140" v-model="form.endSubmitDate" type="date" value-format="yyyy-MM-dd" placeholder="结束日期"></el-date-picker>
							</el-form-item>
						</block>
						<el-form-item>
							<el-button type="primary" @click="refreshList(1)">查询</el-button>
							<el-button type="default" plain @click="resetSearch">重置</el-button>
							<el-button type="primary" plain @click="showmore = !showmore">
								更多筛选条件
								<i :class="{ 'el-icon-arrow-down': !showmore, 'el-icon-arrow-up': showmore }"></i>
							</el-button>
						</el-form-item>
					</el-form>
				</div>
			</basic-container>
			<basic-container>
				<el-table ref="table" :data="tableData" :height="$height - 290 + 'px'" v-loading="loading">
					<el-table-column type="expand" width="1">
						<template slot-scope="scope">
							<div class="flex_row">
								<table class="">
									<tr v-for="item in scope.row.userList" :key="item.id">
										<td width="140"></td>
										<td width="140"></td>
										<td width="100">
											<el-tooltip effect="dark" :content="item.reviewDeptName" placement="top-start">
												<div class="cell overell pointer" style="width: 100px;">{{ item.reviewDeptName }}</div>
											</el-tooltip>
										</td>
										<td width="100">
											<el-tooltip effect="dark" :content="item.reviewUserName" placement="top-start">
												<div class="cell overell pointer" style="width: 100px;">{{ item.reviewUserName }}</div>
											</el-tooltip>
										</td>
									</tr>
								</table>

								<table>
									<tr class="flex_center" style="width: 220px;" v-for="(item, i) in scope.row.jiluFileList" :key="i">
										<td>
											<el-tooltip effect="dark" :content="item.name" placement="top-start">
												<div class="cell overell pointer" style="width: 110px;">{{ item.name }}</div>
											</el-tooltip>
										</td>
										<td>
											<el-tooltip effect="dark" :content="item.serialNumber" placement="top-start">
												<div class="cell overell pointer" style="width: 110px;">{{ item.serialNumber }}</div>
											</el-tooltip>
										</td>
									</tr>
								</table>
							</div>
						</template>
					</el-table-column>
					<el-table-column type="index" width="50" label="序号"></el-table-column>
					<el-table-column prop="number" width="140" label="经销商管理编号" show-overflow-tooltip></el-table-column>
					<el-table-column label="经销商名称" width="140" show-overflow-tooltip>
						<template slot-scope="scope">
							<span class="pointer main_co" v-if="!scope.row.expansion" @click="toogleExpand(scope.row)">
								展开全部
								<i class="el-icon-arrow-right ml0 main_co"></i>
							</span>
							<span class="pointer main_co" v-else @click="toogleExpand(scope.row)">
								收起全部
								<i class="el-icon-arrow-down ml0 main_co"></i>
							</span>
						</template>
					</el-table-column>
					<el-table-column label="质量管理体系" width="120" show-overflow-tooltip></el-table-column>
					<el-table-column label="经销商资质" width="160" show-overflow-tooltip></el-table-column>
					<el-table-column label="销售产品-产品名称" width="200" show-overflow-tooltip></el-table-column>
					<el-table-column prop="manageDeptName" label="管理部门" show-overflow-tooltip></el-table-column>
					<el-table-column prop="manageUserName" label="负责人" show-overflow-tooltip></el-table-column>
					<el-table-column label="记录文件名称" width="110"></el-table-column>
					<el-table-column label="记录流水编号" width="110"></el-table-column>
					<el-table-column prop="retentionPeriod" label="记录保存年限(年)" width="130"></el-table-column>
					<el-table-column prop="createDeptName" label="编制部门" show-overflow-tooltip></el-table-column>
					<el-table-column prop="createUserName" label="编制人" show-overflow-tooltip></el-table-column>
					<el-table-column label="提交时间" prop="createTime" width="160"></el-table-column>
					<el-table-column label="批准日期" width="100">
						<template slot-scope="scope">
							{{ scope.row.beginTime.substr(0, 10) || '-' }}
						</template>
					</el-table-column>
					<el-table-column label="工作流状态" fixed="right" width="100">
						<template slot-scope="scope">
							<span :class="processStatusList[scope.row.processStatus].class">
								{{ scope.row.processStatus >= 0 ? processStatusList[scope.row.processStatus].text : '-' }}
							</span>
						</template>
					</el-table-column>
					<el-table-column prop="address" label="操作" fixed="right" width="260">
						<template slot-scope="scope">
							<span class="pointer main_co f14" v-if="permission.jxsgl_show" @click="handleShow(scope.row)">
								查看
							</span>
							<span class="pointer main_co f14 ml30" v-if="scope.row.ishasDecrypt != 1 && userInfo.user_id == scope.row.createUser" @click="creatNew(scope.row, 2)">
								快捷新增
							</span>
							<span class="pointer main_co f14 ml30" @click="applyShow(scope.row)" v-if="scope.row.ishasDecrypt == 1">解密</span>
							<span
								class="pointer red_f f14 ml30"
								v-if="permission.jxsgl_del && scope.row.processStatus == 7 && userInfo.user_id == scope.row.createUser && scope.row.isShowDel == 1"
								@click="confirmDel(scope.row)"
							>
								删除
							</span>
							<span
								class="pointer main_co f14 ml30"
								v-if="
									userInfo.user_id == scope.row.createUser &&
										permission.jxsgl_create &&
										scope.row.isDeleted == '0' &&
										(scope.row.processStatus == 4 || scope.row.processStatus == 5 || scope.row.processStatus == 6)
								"
								@click="creatNew(scope.row, 1)"
							>
								修改
							</span>
						</template>
					</el-table-column>
					<empty slot="empty"></empty>
				</el-table>
				<el-card class="pub_right">
					<el-pagination
						@size-change="sizeChangeHandle"
						@current-change="currentChangeHandle"
						:current-page="pageNo"
						:page-size="pageSize"
						:total="total"
						background
						layout="total, prev, pager, next, jumper"
					></el-pagination>
				</el-card>
			</basic-container>
		</div>
		<encryption :list="rowFileList" ref="encryption"></encryption>
	</div>
</template>

<script>
import { getguifanList } from '@/api/myapi/tixiwenjian';
import creat from './creat.vue';
import check1 from './check1.vue';
import check from './check.vue';
import show from './show.vue';
export default {
	components: {
		creat,
		check1,
		check,
		show
	},
	data() {
		return {
			type: 0,
			tableData: [],
			detailId: '',
			showcreat: false,
			showcheck: false,
			showmore: false,
			show: false,
			pageNo: 1,
			pageSize: 10,
			total: 0,
			loading: false,
			system: 'dealerprocess',
			memberOption: [],
			form: {}
		};
	},
	created() {
		this.refreshList(1);
		this.getdeptlist();
		this.getAlluser();
	},
	methods: {
		// 新建文件
		creatNew(row, type) {
			if (row) {
				this.type = type;
				this.detailId = row.id;
			} else {
				this.type = 0;
				this.detailId = '';
			}
			this.showcreat = true;
		},
		// 获取数据列表
		refreshList(pageNo) {
			this.showcreat = false;
			this.showupgrade = false;
			this.loading = true;
			this.pageNo = pageNo;
			getguifanList(
				{
					current: pageNo,
					size: this.pageSize,
					descs: 'create_time',
					...this.form
				},
				this.system
			).then(({ data }) => {
				if (data && data.success) {
					this.tableData = data.data.records;
					this.total = data.data.total;
					this.loading = false;
				}
			});
		},
		resetSearch() {
			this.form = {};
			this.pageNo = 1;
			this.refreshList(this.pageNo);
		},
		// 当前页
		currentChangeHandle(val) {
			this.pageNo = val;
			this.refreshList(val);
		}
	}
};
</script>

<style scoped="scoped">
::v-deep .el-table__expand-icon {
	font-size: 0;
}
</style>
